<template>
  <div class="box">
    <h2>商品详情</h2>
    <div>
      <img :src="school[0].img" alt="" />
      <p>{{ school[0].name }}</p>
      <p>价格：￥{{ school[0].price }}</p>
      <p>详情：{{ school[0].text }}</p>
    </div>
    <button @click="tian">添加购物车</button>
  </div>
</template>
<script>
export default {
  name: "shang",
  components: {},
  data() {
    return {
      school: [],
    };
  },
  mounted() {
    if (this.$route.params.id == undefined) {
      alert("商品详情获取错误");
      this.$router.push({ name: "Home" });
    }
    this.ajax({
      method: "post",
      url: "/queryID",
      data: {
        id: this.$route.params.id,
      },
    })
      .then((res) => {
        console.log(res.data);
        this.school = res.data;
      })
      .catch((res) => {
        this.school = res.data;
      });
  },
  methods: {
      tian(){
          if(localStorage.user==undefined){
              alert("请登录后再添加购物车");
              this.$router.push({name:'Loginden',params:{id:this.$route.params.id}});
          }else{
              console.log();
              alert("添加成功")
          }
      }
  }
};
</script>
<style lang="scss" scoped>
    img{
        width: 100%;
    }
    button{
        width: 130px;
        height: 50px;
        border: rgb(243, 195, 177) solid 1px;
        background-color: rgb(238, 225, 202);
        outline: none;
        border-radius: 10px;
    }
</style>